<?xml version="1.0" encoding="UTF-8" ?>
<%@page import="com.stx.entity.Article"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ include file="header.jspf"%>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/vue.js"></script>
<script type="text/javascript">
//	$(function() {
//		$("#all").click(function() {
//			$.ajax({
//				type : "get",
//				url : "ArticleServlet",
//				async : true,
//				data : "op=all",
//				success : function(data) {
//					var article = eval("(" + data + ")");
//					alert(article[0].articleTitle);
//					for (var i = 3; i < data.length; i++) {
//
//					}
//				}
//			});
//		});
//	});
</script>

<script type="text/javascript">
//  $(function(){
//  	$("#too_main").hide();
//  });

	$(function() {
		var articlesVue = new Vue({
			el : '#main',
			data : {
				articlesList : ''
			},
			methods : {
				articlesSearch : function() {
//					alert("提交");
					$("#too_main").show();
					var _self = this;
					$.ajax({
						type : 'GET',
						url : 'listAllArticle.do',
						success : function(data) {
							_self.articlesList = data;
						}
					});
				}
			}
		});
	});
</script>
<div id="main">
	<c:if test="${not empty requestScope.ARTICLES}">
		<c:forEach var="article" items="${requestScope.ARTICLES}">

			<h1>
				${article.articleTitle} &nbsp;&nbsp;&nbsp;&nbsp;<font size="-1">${article.articleTime}</font>
			</h1>
			<div class="content">
				&nbsp;&nbsp;&nbsp;&nbsp;${article.articleContent}
				<div class="line">
					<div class="read">
						<a href="#">阅读</a>(2)&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">评论</a>(0)
					</div>
					<div class="all">
						<a href="blogcontent.html">查看全文>></a>
					</div>
				</div>
			</div>
		</c:forEach>
	</c:if>
	<div id="too_main" v-for="article in articlesList">
		<h1>
			{{article.articleTitle}} &nbsp;&nbsp;&nbsp;&nbsp;<font size="-1">{{article.articleTime}}</font>
		</h1>
		<div class="content">
			&nbsp;&nbsp;&nbsp;&nbsp;{{article.articleContent}}
			<div class="line">
				<div class="read">
					<a href="#">阅读</a>(2)&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">评论</a>(0)
				</div>
			</div>
		</div>
	</div>
	<div id="page">
		<div id="all" v-on:click="articlesSearch()">阅读更多</div>
	</div>

	<%@ include file="footer.jspf"%>

	</body>
	</html>